import { defineStore } from "pinia";
import { tabBarList as tabBar } from "@/config/constant";

const actions = () => {
  const initialState = ref<useGlobalStoreType.stateType>({
    // 主题颜色
    primary: "#34A668",
    // 夜间模式
    theme: "light",
    // 是否启用自定义底部TabBar
    customizeTabBarEnable: true,
    // 底部 TabBar 数据
    tabBarList: [],
    // 底部 TabBar 高度
    tabBarHeight: 0,
    // 当前选中的TabBar索引
    currentSelectedValue: 0
  });

  const setGlobalState = <T extends keyof useGlobalStoreType.stateType>(payload: useGlobalStoreType.payloadType<T>) => {
    initialState.value[payload.key] = payload.value;
  };

  const setDynamicTabBar = () => {
    // #ifdef MP | APP-PLUS
    uni.hideTabBar().catch(() => {});
    // #endif
    // #ifdef H5
    // H5 端隐藏全局 tabBar
    const tabBarEl = document.querySelector(".uni-tabbar-bottom") as HTMLElement;
    if (tabBarEl) tabBarEl.style.display = "none";
    // #endif

    // 初始化 tabBar 状态
    setGlobalState({ key: "currentSelectedValue", value: 0 });

    setGlobalState({ key: "tabBarList", value: tabBar });
  };

  return { initialState, setGlobalState, setDynamicTabBar };
};

export const useGlobalStore = defineStore("useGlobalStore", () => actions(), { persist: true });
